<template>
	<view class="container">
		<view class="header">
			<image class="banner" :src="banner" mode="widthFix"></image>
		</view>
		<view class="menu">
			<view class="title">
				<text>常用功能</text>
      </view>
      <up-grid :border="false" col="4">
          <up-grid-item class="item" v-for="(item,index) in menuList" :key="index" @click="handleClick(item)">
              <view class="item-image">
                <u-image width="80rpx" height="80rpx" radius="6px" bgColor="none" :src="item.image"></u-image>
              </view>
              <text class="text-[24rpx]">{{item.title}}</text>
          </up-grid-item>
      </up-grid>
		</view>
    <f-tabbar :current="0"></f-tabbar>
	</view>
</template>

<script lang="ts" setup>
import { ref } from 'vue';
import { getAdminConfigApi } from '../../api';
import { onLoad } from '@dcloudio/uni-app';
import FTabbar from '@/addon/htscrm/components/f-tabbar/index.vue'
import { redirect } from '@/utils/common';

const config = ref<any>({})
const banner = ref('http://static.fastht.com/beb4b0a455e66345/061aad230cfa24a3.jpg')
const menuList = ref([  
    {  
        disabled: false,
        url: '/addon/htscrm/pages/admin/store/index',
        image: 'http://static.fastht.com/bd248ec35789d39c/6db78b2c15ff5f41.png',  
        title: '门店管理'  
    },  
    {  
      disabled: false,
        url: '/addon/htscrm/pages/admin/store/recharge',
        image: 'http://static.fastht.com/bd248ec35789d39c/6db78b2c15ff5f41.png',  
        title: '账户充值'  
    },  
    {  
      disabled: false,
        url: '/addon/htscrm/pages/admin/store/finance',
        image: 'http://static.fastht.com/b392e923052aea8f/77dcfe38f7462754.png',  
        title: '门店财务'  
    },  
    {  
      disabled: false,
        url: '',
        image: 'http://static.fastht.com/bf87319e3b3608fa/cbd9ed11d65869d3.png',  
        title: '邀请记录'  
    },  
    {  
      disabled: false,
        url: '/addon/htscrm/pages/admin/customer/index',
        param: {
          status: 2
        },
        image: 'http://static.fastht.com/bd248ec35789d39c/6db78b2c15ff5f41.png',  
        title: '审核客户'  
    },  
    {  
      disabled: false,
        url: '',
        image: 'http://static.fastht.com/b44a8754f55d2187/e97903f3053a019f.png',  
        title: '抽奖记录'  
    },  
    {  
      disabled: false,
        url: '/addon/htscrm/pages/admin/analysis',
        image: 'http://static.fastht.com/7d8a23137693d0c8/01cf56e6754edf90.png',  
        title: '数据分析'  
    },  
    {  
      disabled: false,
        url: '/addon/htscrm/pages/admin/store/transfer',
        image: 'http://static.fastht.com/c59b355eae77d257/5290ddfe0fe26479.png',  
        title: '资产转移'  
    },  
]); 

/**
 * 获取配置信息
 */
async function getConfig() {
    try {
        const res = await getAdminConfigApi('system')
        config.value = res.data
        if(res.data.store_setting?.banner) {
          banner.value = res.data.store_setting?.banner
        }
        
    } catch (error) {
        console.log(error);
        
    }
}

function handleClick(item:any) {
  if(item.disabled) return
  redirect({
    url: item.url,
    param: item.param
  })
}

onLoad(() => {
  getConfig()
})


</script>
<style lang="scss" scoped>
.container {
  .header {
    width: 100%;
    padding: 30rpx;
    box-sizing: border-box;

    .banner {
      display: block;
      width: 100%;
      border-radius: 20rpx;
    }

  }

  .menu {
    .title {
      padding: 30rpx;
      position: relative;

      &::before {
        content: "";
        position: absolute;
        left: 10rpx;
        top: 50%;
        transform: translateY(-50%);
        height: 30rpx;
        width: 10rpx;
        background-color: #2196f3;
        border-radius: 10rpx;
      }
    }

    .item {
      margin-bottom: 30rpx;
    }
    
    .item-image {
      background: linear-gradient(150deg, #5acbff 0, #067eff 100%);
      padding: 14rpx;
      box-sizing: border-box;
      border-radius: 12rpx;
      margin-bottom: 16rpx;
    }
  }
}


</style>